<!--
 * @Author: zhangyang
 * @Date: 2021-09-09 11:28:07
 * @LastEditTime: 2021-09-18 15:03:02
 * @Description: 主体框架(tabbar 页面)
-->
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  async beforeRouteEnter(to, from, next) {
    console.log('---页面拦截---');
    console.log(to);
    console.log(from);
    next();
  }
});
</script>
<script lang="ts" setup>
import Home from './home.vue';
import Address from './address.vue';
import Find from './find.vue';
import My from './my.vue';
import { tabBarIndex } from '../../store';
const componentMap = [Home, Address, Find, My];
</script>
<template>
  <component :is="componentMap[tabBarIndex]" />
  <van-tabbar v-model="tabBarIndex">
    <van-tabbar-item icon="chat-o">消息</van-tabbar-item>
    <van-tabbar-item icon="friends-o">通讯录</van-tabbar-item>
    <van-tabbar-item icon="search">发现</van-tabbar-item>
    <van-tabbar-item icon="user-o">我的</van-tabbar-item>
  </van-tabbar>
</template>
